<!--
 * @Description: * 
 * @Date: 2020-12-27 17:02:35
 * @LastEditTime: 2021-01-11 21:09:49
 * @Author: Ji YingHao
 * @FilePath: \iview\components\Login.vue
-->
<template>
  <div class="login">
    <Modal
      title="立即登录"
      v-model="modal10"
      footer-hide
      draggable
      class-name="vertical-center-modal"
    >
      <div class="login_list">
        <Input placeholder="输入账号" v-model="from.account" style="width: 100%">
          <Icon type="ios-contact" slot="prefix" />
        </Input>
        <Input placeholder="输入密码" v-model="from.password" password style="width: 100%">
          <Icon type="ios-medical" slot="prefix" />
        </Input>

        <Poptip trigger="focus" style="width: 150px">
          <Input
            v-model="value15"
            prefix="logo-usd"
            placeholder="验证码"
            style="width: 100%"
          />
          <div slot="content">{{ "formatNumber" }}</div>
        </Poptip>
        <div class="code_img">验证码</div>
        <Button long type="primary" @click="loginFun">登录</Button>
        <Button long @click="loggingFun">去注册</Button>
      </div>
    </Modal>
    <Logging ref="loggingRef" />
  </div>
</template>
<script>
import API from "@/api/index";
export default {
  name: "login",
  components: {},
  data() {
    return {
      modal10: false,
      value15: "123456",
      from:{
        "account": "18503068090",
        "password": "123456",
        "spread_spid": 0
      }
    };
  },
  computed: {},
  mounted: function () {
    // console.log(this.$store.state.user.userData.name);
    // this.$store.commit("user/updateUserData", { name: "kkkkooo" });
  },
  methods: {
    open() {
      this.modal10 = true;
    },
    loginFun() {
      API.login(this.from).then((res) => {
        console.log(res)
        if( res.code !== 200 ){
          this.$Notice.error({
          title: "登录失败！",
          desc: res.message
        });
        return;
        }
        console.log( res.data );
        this.$store.commit("login/uploginData", res.data);
        API.saveCookie('key',res.data.token,365);
        this.modal10 = false;
        this.$Notice.success({
          title: "登录成功！",
          desc:
            "登录成功描述文字。 ",
        });
        this.$emit('loinSuccess')
      })
      .catch(res=>{
        console.log(res);
      }) ;
      
    },
    loggingFun() {
      this.modal10 = false;
      this.$refs.loggingRef.open();
    },
  },
};
</script>
<style lang="scss">
.login {
}
.login_list {
  width: 300px;
  display: block;
  margin: 20px auto;
  > div {
    margin-bottom: 10px;
  }
  > button {
    margin-bottom: 10px;
  }
  .code_img {
    width: 140px;
    height: 32px;
    background-color: chocolate;
    display: inline-block;
    float: right;
    text-align: center;
    border-radius: 5px;
    color: #fff;
  }
}
</style>